<!DOCTYPE html>
<html>
<head>
<script src="lib.js"></script>
<script>
function broadcast(msg) {
    chrome.windows.getAll({'populate':true}, function(windows) {
        for(var i=0; i<windows.length; i++) {
            for(var j=0; j<windows[i].tabs.length; j++) {
                var tab=windows[i].tabs[j];
                chrome.tabs.sendRequest(tab.id, msg);
            }
        }
    });
}
function save_options() {
  var input = document.getElementById("collapse");
  localStorage['blocker.collapse'] = input.checked;
  var input = document.getElementById("author_comment_bgcolor");
  localStorage['blocker.author_comment_bgcolor'] = input.value;
  var input = document.getElementById("whitelist");
  if(input)
    localStorage['blocker.whitelist'] = input.value;
  broadcast(get_config());
}
function change() {
  save_options();
}
function restore_options() {
  var input = document.getElementById("collapse");
  input.checked = localStorage['blocker.collapse']=='true'
  var input = document.getElementById("author_comment_bgcolor");
  input.value = localStorage['blocker.author_comment_bgcolor']||'#eee';
  var input = document.getElementById("whitelist");
  if(input)
      input.value=localStorage['blocker.whitelist'] || '';
}
</script>
<style>
label {
	display:inline-block;
	width:200px; 
	font-weight:bold;
}
body {
        font-family: sans-serif, helvetica, arial;
        margin-right: 50px;
        margin-left: 120px;
        background: url(icon48.png) no-repeat;
        background-position: 30px 30px;
}
</style>
</head>
<body onload="restore_options()">
<h1>G+ Blocker Options</h1>
<p>
<label title="Collapse blocked comments instead of remove" for="collapse">Collapsing</label><input type="checkbox" id="collapse" onchange="change();"/>
</p>
<p>
<label for="author_comment_bgcolor">Author comments color</label><input type="text" id="author_comment_bgcolor" onchange="change();"/>
</p>
<!--
<p>
<label for="whitelist">Whitelist</label>
<textarea placeholder="list of numerical profile IDs" cols="40" rows="10" id="whitelist" onchange="change();" ></textarea>
</p>-->
</body>
</html>
